/**
 * 入参
    state：4-簿记交收   5-簿记详情   6-指令详情
    instructType：1-存入   2-支取    3-结息
    详情（存入指令详情、支取指令详情、或结息指令详情）
 * 出参
    点击“交收”成功后，抛出onOK事件；
    点击“取消”按钮，抛出onCancle事件。
*/
import React, { PropTypes, PureComponent, Fragment } from 'react';
import { PrimaryC, DATA_ENTRY, AdvancedSearch, FirstHeaderC, SecondHeaderC, PrimaryGhostC } from '../../../comps';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Row, Col, Card, Tabs, Input, Button, message, Table, Divider, DatePicker, Select, Modal } from 'antd';
import style from './index.less';
import SaveOrder from './SaveOrder';
import WithdrawnOrder from './WithdrawnOrder';
import CalcInterestOrder from './CalcInterestOrder';
import config from './config';
const confirm = Modal.confirm;
import { connect } from 'dva';
import 'moment/locale/zh-cn';
const { TabPane } = Tabs;
@Form.create()
@connect(({ depositOrderM, userM: user }) => ({
  depositOrderM,
  user,
}))
export default class DepositOrderDetail extends PureComponent {
  static defaultProps = {
    jiaoshouClick: () => {},
    cancelClick: () => {},
  };
  state = {
    headBankList: [], //存款总行列表
    //   instructType:'F',//当前tab  //"F" 存入 "i" 支取  "calc" 结息
    typeList: config.typeList, //存款类型
  };

  componentDidMount() {
    // this.getHeadBankList();//查询总行列表
  }

  UNSAFE_componentWillReceiveProps(nextProps) {}
  //查询总行列表
  getHeadBankList = () => {
    const { infoDetail } = this.props;
    const bankHead = infoDetail.bankHeadOfficeId ? infoDetail.bankHeadOfficeId : infoDetail.bankHeadOfficeName;
    this.props.dispatch({
      type: 'depositOrderM/getHeadBankList',
      payload: {
        productId: infoDetail.combCode,
        value: bankHead,
      },
      callback: (type, value, data) => {
        if (type == 'success') {
          this.setState({
            headBankList: data,
          });
        } else {
          this.setState({
            headBankList: [],
          });
        }
      },
    });
  };
  //点击交收按钮抛出事件
  jiaosouClick = () => {
    this.props.jiaoshouClick();
  };

  //点击取消按钮抛出事件
  cancelClick = () => {
    this.props.cancelClick();
  };
  render() {
    const { headBankList, typeList } = this.state;
    const { instructType, state, infoDetail } = this.props;
    const initComp = (key) => {
      //1-存入   2-支取    3-结息
      if (key === '1') return <SaveOrder state={state} headBankList={headBankList} typeList={typeList} vcBankName={() => {}} depositInfo={infoDetail} />;
      if (key === '2') return <WithdrawnOrder state={state} headBankList={headBankList} typeList={typeList} vcBankName={() => {}} depositInfo={infoDetail} />;
      if (key === '3') return <CalcInterestOrder state={state} headBankList={headBankList} typeList={typeList} vcBankName={() => {}} depositInfo={infoDetail} />;
    };
    return (
      <div>
        {initComp(instructType)}
        {state === 4 ? (
          <div className={'btnOperate'}>
            <PrimaryC title={'交收确认'} onClick={this.jiaosouClick} />
            <PrimaryGhostC title={'取消'} onClick={this.cancelClick} />
          </div>
        ) : null}
      </div>
    );
  }
}
